<template>
  <h1>关于我们</h1>
  <div>
      {{info}}
  </div>
  <router-link to="/home?id=111">返回首页</router-link><br>
  <router-link to="/home?id=222">返回首页</router-link><br>
  <button @click="goHome">跳转到首页</button>
</template>

<script>
import {onMounted, reactive,toRefs} from 'vue'
import {useRoute,useRouter} from 'vue-router'
export default {
  setup(){
    const route=useRoute()
    const router=useRouter()
    const state=reactive({
      info:'暂无介绍'
    })
    onMounted(()=>{
       let id=route.params.id
       switch(~~id){
         case 1:
           state.info='蜗牛学院是蜗牛创想科技旗下的一个主要是进行高端IT培训'
          break
         case 2:
           state.info="阿多比设计是蜗牛创想科技旗下的一个主要设计学院"
          break
       }
    })
    const goHome=()=>{
       //router.push('/home?id=34')
       router.push({
        path:'/home',
        query:{
          id:56
        }
       })

    }
    return {
      ...toRefs(state),
      goHome
    }
  }
}
</script>

<style>

</style>